{extend name="default/base/base_seller" /}
{block name="seller_main"}
<link rel="stylesheet" href="{$Think.ADMIN_SITE_ROOT}/css/layim.css">
<form method="get" action="">
    
    
</form>

<script type="text/javascript" src="{$Think.ADMIN_SITE_ROOT}/js/jquery.edit.js" charset="utf-8"></script>

<!-- 极光im -->
<script src="{$Think.ADMIN_SITE_ROOT}/js/md5.min.js"></script>
<!-- 极光sdk引入 -->
<script src="{$Think.ADMIN_SITE_ROOT}/js/jmessage-sdk-web.2.6.0.min.js"></script>
<!-- 封装js -->
<script src="{$Think.ADMIN_SITE_ROOT}/js/jim_instance.js"></script>

<script>
    var j_info = {$j_info};
    // 会话列表
    let IMfriend = []
    //极光的 kay 和ms
    //当前用户的id  头像  和昵称 
    let myOid = '';
    let myAvatar = '';
    // 消息历史记录
    let OfflineInfo = []

    // 初始化
    $chat.init().then((res => {
        // 登录
        console.log('登录');
        return $chat.login(j_info.customer_j_name, 123456)
    })).then((res => {
        // 获取消息历史记录
        $chat.onSyncConversation((res) => {
            console.log('获取消息历史记录');
            OfflineInfo = res
            // 获取会话列表
            setTimeout(() => {
                setLayImLocal();
            }, 2000)

        })

        $chat.getConversation().then((res => {
            console.log('获取会话列表成功');
            IMfriend = [{
                groupname: "客户",
                id: 1,
                list: res
            }]
            // 初始化layim
            console.log('初始化layim');
            setTimeout(() => {
                initializeIM()
            }, 2000)

        })).catch((err => {
            console.log(err);
        }))

        // 监听极光的事件
        jimEventInit()

        // 登录完获取用户信息
        $chat.getUserInfo(res.username).then((res => {
            // 用户数据储存
            // console.log(res);
            myAvatar = res.avatar ? res.avatar :
                'http://33wang.douyinhot.com/4bad2202003051614055110.jpg'
            myOid = res.username
            // 获取会话列表
        }))
    }))


    function jimEventInit() {
        // 极光im事件监听
        // 接收消息
        $chat.onMsgReceive((res) => {
            console.log(res);
            $chat.getUserInfo(res.messages[0].content.from_id)
                .then((from_user_info => {
                    console.log('接收到了消息');
                    console.log(res.messages[0].content.msg_body.extras.msg_type);
                    if (res.messages[0].content.msg_body.extras.msg_type == "text") {
                        // 文本消息
                        layim.getMessage({
                            username: from_user_info.username, //消息来源用户名
                            avatar: from_user_info.avatar ? from_user_info.avatar :
                                "http://33wang.douyinhot.com/4bad2202003051614055110.jpg", //消息来源用户头像
                            id: from_user_info.username, //消息的来源ID（如果是私聊，则是用户id，如果是群聊，则是群组id）
                            type: "friend", //聊天窗口来源类型，从发送消息传递的to里面获取
                            content: res.messages[0].content.msg_body.text, //消息内容
                            cid: res.messages[0].msg_id, //消息id，可不传。除非你要对消息进行一些操作（如撤回）
                            mine: false, //是否我发送的消息，如果为true，则会显示在右方
                            fromid: from_user_info
                            .username, //消息的发送者id（比如群组中的某个消息发送者），可用于自动解决浏览器多窗口时的一些问题
                            timestamp: res.messages[0].content
                                .create_time //服务端时间戳毫秒数。注意：如果你返回的是标准的 unix 时间戳，记得要 *1000
                        });
                    } else if (res.messages[0].content.msg_body.extras.msg_type == "image") {
                        layim.getMessage({
                            username: from_user_info.username, //消息来源用户名
                            avatar: from_user_info.avatar ? from_user_info.avatar :
                                "http://33wang.douyinhot.com/4bad2202003051614055110.jpg", //消息来源用户头像
                            id: from_user_info.username, //消息的来源ID（如果是私聊，则是用户id，如果是群聊，则是群组id）
                            type: "friend", //聊天窗口来源类型，从发送消息传递的to里面获取
                            content: 'img[' + res.messages[0].content.msg_body.text +
                            ']', //消息内容
                            cid: res.messages[0].msg_id, //消息id，可不传。除非你要对消息进行一些操作（如撤回）
                            mine: false, //是否我发送的消息，如果为true，则会显示在右方
                            fromid: from_user_info
                            .username, //消息的发送者id（比如群组中的某个消息发送者），可用于自动解决浏览器多窗口时的一些问题
                            timestamp: res.messages[0].content
                                .create_time //服务端时间戳毫秒数。注意：如果你返回的是标准的 unix 时间戳，记得要 *1000
                        });
                    } else if (res.messages[0].content.msg_body.extras.msg_type == "file") {
                        layim.getMessage({
                            username: from_user_info.username, //消息来源用户名
                            avatar: from_user_info.avatar ? from_user_info.avatar :
                                "http://33wang.douyinhot.com/4bad2202003051614055110.jpg", //消息来源用户头像
                            id: from_user_info.username, //消息的来源ID（如果是私聊，则是用户id，如果是群聊，则是群组id）
                            type: "friend", //聊天窗口来源类型，从发送消息传递的to里面获取
                            "content": "file(" + res.messages[0].content.msg_body.text +
                                ")[下载文件]",
                            cid: res.messages[0].msg_id, //消息id，可不传。除非你要对消息进行一些操作（如撤回）
                            mine: false, //是否我发送的消息，如果为true，则会显示在右方
                            fromid: from_user_info
                            .username, //消息的发送者id（比如群组中的某个消息发送者），可用于自动解决浏览器多窗口时的一些问题
                            timestamp: res.messages[0].content
                                .create_time //服务端时间戳毫秒数。注意：如果你返回的是标准的 unix 时间戳，记得要 *1000
                        });
                    }
                }))
        })
    }

    // 自定义聊天窗口
    function customChat(target_username) {
        layim.chat({
            name: target_username, //名称
            type: 'friend', //聊天类型
            avatar: 'http://33wang.douyinhot.com/4bad2202003051614055110.jpg', //头像
            id: target_username //定义唯一的id方便你处理信息
        });
    }

    //初始化 layim
    function initializeIM() {
        layui.use('layim', function () {
            var $ = layui.$;
            layim = layui.layim;
            //基础配置
            layim.config({
                //初始化接口
                init: {
                    //极光的数据 不是请求的所以自定义
                    mine: {
                        "username": myOid //我的昵称
                            ,
                        "id": myOid //我的ID
                            ,
                        "status": "online" //在线状态 online：在线、hide：隐身
                            ,
                        "sign": "" //我的签名
                            ,
                        "avatar": myAvatar //我的头像
                    },
                    friend: IMfriend
                    //现在还没有组聊天 先不用
                    //,group: []
                },
                // tool: [{
                //   alias: 'sendPic', //工具别名
                //   title: '发送图片', //工具名称
                //   icon: '&#xe60d;' //工具图标，参考图标文档
                // }],
                uploadImage: {
                    url: 'https://three.douyinhot.com/index.php/api/home/im_image_upload' //（返回的数据格式见下文）
                },
                uploadFile: {
                    url: 'https://three.douyinhot.com/index.php/api/home/im_image_upload' //（返回的数据格式见下文）
                },
                //, isAudio: true //开启聊天工具栏音频
                //, isVideo: true //开启聊天工具栏视频
                // ,
                title: myOid //自定义主面板最小化时的标题
                    ,
                // initSkin: '3.jpg' //1-5 设置初始背景
                // ,
                notice: true,
                //,chatLog: layui.cache.dir + 'css/modules/layim/html/chatlog.html'
                //, face:false
            });

            //监听layui发送消息
            layim.on('sendMessage', function (data) {
                //对方账号信息
                let to = data.to
                //我的账号信息
                let mine = data.mine;
                if (mine.content.indexOf('img[') >= 0) {
                    // 发送照片
                    console.log('发送图片');
                    // file(http://33wang.douyinhot.com/85b31202004151922423747.jpg)[下载文件]
                    $chat.sendSingleMsg(to.id, mine.content.replace(/(^img\[)|(\]$)/g, ''), 'image')
                } else if (mine.content.indexOf('file(') >= 0) {
                    console.log('发送文件');
                    $chat.sendSingleMsg(to.id, mine.content.replace(/(^file\()|(\)\[下载文件\]$)/g, ''),
                        'file')
                } else {
                    // 调用极光发送消息
                    console.log('发送文本');
                    $chat.sendSingleMsg(to.id, mine.content, 'text')
                }
            });

        });
    }



    //初始化  漫游消息
    //如果  新浏览器没有 layim 的缓存的 才获取漫游消息
    function setLayImLocal() {
        //初始化结束  开始推送离线消息
        layui.data('layim', {
            key: myOid,
            value: {}
        });
        //这次循环的是所有用户
        let chatlog = {};

        // 循环每个用户的记录列表
        for (var i = 0; i < OfflineInfo.length; i++) {
            // 循环用户的聊天列表
            for (var j = 0; j < IMfriend[0].list.length; j++) {
                // 如果这组聊天记录是这个用户的 IMfriend的id设置的是username 可以用来判断
                if (OfflineInfo[i].from_username == IMfriend[0].list[j].id) {
                    // var useroid = "friend" + IMfriend[0].list[j].id; //friendadmin-zjw222
                    // var thisid = [];
                    // console.log(useroid, chatlog, thisid);
                    chatlog['friend' + IMfriend[0].list[j].id] = [];
                    let chatlog_item = chatlog['friend' + IMfriend[0].list[j].id];
                    // 循环单个列表中的每个聊天记录
                    for (var x = 0; x < OfflineInfo[i].msgs.length; x++) {
                        if (!OfflineInfo[i].msgs[x].content.msg_body.extras) continue;
                        //如果target_id是自己 说明自己是接收方
                        if (OfflineInfo[i].msgs[x].content.target_id == myOid) {
                            // 接收消息
                            if (OfflineInfo[i].msgs[x].content.msg_body.extras.msg_type == "text") {
                                //文本消息
                                chatlog_item.push({
                                    "username": OfflineInfo[i].msgs[x].content.from_id,
                                    "avatar": IMfriend[0].list[j].avatar,
                                    "id": IMfriend[0].list[j].id,
                                    "type": "friend",
                                    "content": OfflineInfo[i].msgs[x].content.msg_body.text,
                                    "timestamp": OfflineInfo[i].msgs[x].ctime_ms,
                                    "mine": false
                                });
                            } else if (OfflineInfo[i].msgs[x].content.msg_body.extras.msg_type == "image") {
                                //图片消息
                                chatlog_item.push({
                                    "username": OfflineInfo[i].msgs[x].content.from_id,
                                    "avatar": IMfriend[0].list[j].avatar,
                                    "id": IMfriend[0].list[j].id,
                                    "type": "friend",
                                    "content": "img[" + OfflineInfo[i].msgs[x].content.msg_body.text + "]",
                                    "timestamp": OfflineInfo[i].msgs[x].ctime_ms,
                                    "mine": false
                                });
                            } else if (OfflineInfo[i].msgs[x].content.msg_body.extras.msg_type == "file") {
                                //文件
                                chatlog_item.push({
                                    "username": OfflineInfo[i].msgs[x].content.from_id,
                                    "avatar": IMfriend[0].list[j].avatar,
                                    "id": IMfriend[0].list[j].id,
                                    "type": "friend",
                                    "content": "file(" + OfflineInfo[i].msgs[x].content.msg_body.text +
                                        ")[下载文件]",
                                    "timestamp": OfflineInfo[i].msgs[x].ctime_ms,
                                    "mine": false
                                });
                            }
                            // fromid: "admin-zjw222"
                        } else {
                            // 自己是发送方
                            if (OfflineInfo[i].msgs[x].content.msg_body.extras.msg_type == "text") {
                                //文本消息
                                chatlog_item.push({
                                    "username": OfflineInfo[i].msgs[x].content.from_id,
                                    "avatar": IMfriend[0].list[j].avatar,
                                    "id": IMfriend[0].list[j].id,
                                    "type": "friend",
                                    "content": OfflineInfo[i].msgs[x].content.msg_body.text,
                                    "timestamp": OfflineInfo[i].msgs[x].ctime_ms,
                                    "mine": true
                                });
                            } else if (OfflineInfo[i].msgs[x].content.msg_body.extras.msg_type == "image") {
                                //图片消息
                                chatlog_item.push({
                                    "username": OfflineInfo[i].msgs[x].content.from_id,
                                    "avatar": IMfriend[0].list[j].avatar,
                                    "id": IMfriend[0].list[j].id,
                                    "type": "friend",
                                    "content": "img[" + OfflineInfo[i].msgs[x].content.msg_body.text + "]",
                                    "timestamp": OfflineInfo[i].msgs[x].ctime_ms,
                                    "mine": true
                                });
                            } else if (OfflineInfo[i].msgs[x].content.msg_body.extras.msg_type == "file") {
                                //文件消息
                                chatlog_item.push({
                                    "username": OfflineInfo[i].msgs[x].content.from_id,
                                    "avatar": IMfriend[0].list[j].avatar,
                                    "id": IMfriend[0].list[j].id,
                                    "type": "friend",
                                    "content": "file(" + OfflineInfo[i].msgs[x].content.msg_body.text +
                                        ")[下载文件]",
                                    "timestamp": OfflineInfo[i].msgs[x].ctime_ms,
                                    "mine": true
                                });
                            }
                        }
                    }
                }
            }
        }
        console.log(chatlog);
        // 同步数据
        layui.data('layim', {
            key: myOid,
            value: {
                chatlog,
            }
        });

    }
</script>
{/block}